export default class WarnHandler {
    constructor() {
        this._marker = null;
        this._popup = null;
        this._moveFeature = null
        this._clickFeature = null
    }

    onMouseClickWarnHandler (map, feature){
        if (!map) {
            return;
        }
        if (this._popup) {
            this._popup.remove();
            this._popup = null;
        }
        if (this._marker) {
            this._marker.remove();
            this._marker = null;
        }
        if (!feature) {
            this._clickFeature = null;
        } else {
            this._moveFeature = null;
            this._clickFeature = feature;
        }
        if (this._clickFeature) {
            const _properties = this._clickFeature.properties;
            const alarm = JSON.parse(_properties.alarm)[0];
            let el = document.createElement('div');
            el.className = 'function-detail';

            let dev0 = document.createElement('div');
            dev0.className = 'half-top';
            let warnType =parseInt(alarm['w4']);
            let warnLevel =parseInt(alarm['w6']);
            if (warnType == '01') {
                if (warnLevel == '01') {
                    dev0.className = 'img01';
                }else if (warnLevel == '02') {
                    dev0.className = 'img02';
                }else if (warnLevel == '03') {
                    dev0.className = 'img03';
                }else if (warnLevel == '04') {
                    dev0.className = 'img04';
                }
            }else if (warnType == '02') {
                if (warnLevel == '01') {
                    dev0.className = 'img05';
                }else if (warnLevel == '02') {
                    dev0.className = 'img06';
                }else if (warnLevel == '03') {
                    dev0.className = 'img07';
                }else if (warnLevel == '04') {
                    dev0.className = 'img08';
                }
            }else if (warnType == '03') {
                if (warnLevel == '01') {
                    dev0.className = 'img09';
                }else if (warnLevel == '02') {
                    dev0.className = 'img10';
                }else if (warnLevel == '03') {
                    dev0.className = 'img11';
                }else if (warnLevel == '04') {
                    dev0.className = 'img12';
                }
            }else if (warnType == '04') {
                if (warnLevel == '01') {
                    dev0.className = 'img13';
                }else if (warnLevel == '02') {
                    dev0.className = 'img14';
                }else if (warnLevel == '03') {
                    dev0.className = 'img15';
                }else if (warnLevel == '04') {
                    dev0.className = 'img16';
                }
            }else if (warnType == '05') {
                if (warnLevel == '01') {
                    dev0.className = 'img17';
                }else if (warnLevel == '02') {
                    dev0.className = 'img18';
                }else if (warnLevel == '03') {
                    dev0.className = 'img19';
                }else if (warnLevel == '04') {
                    dev0.className = 'img20';
                }
            }else if (warnType == '06') {
                if (warnLevel == '02') {
                    dev0.className = 'img21';
                }else if (warnLevel == '03') {
                    dev0.className = 'img22';
                }else if (warnLevel == '04') {
                    dev0.className = 'img23';
                }
            }else if (warnType == '07') {
                if (warnLevel == '02') {
                    dev0.className = 'img24';
                }else if (warnLevel == '03') {
                    dev0.className = 'img25';
                }else if (warnLevel == '04') {
                    dev0.className = 'img26';
                }
            }else if (warnType == '08') {
                if (warnLevel == '03') {
                    dev0.className = 'img27';
                }else if (warnLevel == '04') {
                    dev0.className = 'img28';
                }
            }else if (warnType == '09') {
                if (warnLevel == '02') {
                    dev0.className = 'img29';
                }else if (warnLevel == '03') {
                    dev0.className = 'img30';
                }else if (warnLevel == '04') {
                    dev0.className = 'img31';
                }
            }else if (warnType == '10') {
                if (warnLevel == '03') {
                    dev0.className = 'img32';
                }else if (warnLevel == '04') {
                    dev0.className = 'img33';
                }
            }else if (warnType == '11') {
                if (warnLevel == '01') {
                    dev0.className = 'img34';
                }else if (warnLevel == '02') {
                    dev0.className = 'img35';
                }else if (warnLevel == '03') {
                    dev0.className = 'img36';
                }
            }else if (warnType == '12') {
                if (warnLevel == '02') {
                    dev0.className = 'img37';
                }else if (warnLevel == '03') {
                    dev0.className = 'img38';
                }else if (warnLevel == '04') {
                    dev0.className = 'img39';
                }
            }else if (warnType == '13') {
                if (warnLevel == '02') {
                }else if (warnLevel == '03') {
                    dev0.className = 'img40';
                }
            }else if (warnType == '14') {
                if (warnLevel == '02') {
                    dev0.className = 'img41';
                }else if (warnLevel == '03') {
                    dev0.className = 'img42';
                }else if (warnLevel == '04') {
                    dev0.className = 'img43';
                }
            }
            el.appendChild(dev0);

            let dev2 = document.createElement('div');
            dev2.className = 'function-img';
            dev0.appendChild(dev2);

            let dev3 = document.createElement('div');
            dev3.className = 'half-top-right';
            dev0.appendChild(dev3);

            let dev4 = document.createElement('div');
            dev4.className = 'function-title';
            dev4.innerHTML = alarm['w13'] || '';
            dev3.appendChild(dev4);

            let dev5 = document.createElement('div');
            dev5.className = 'function-time';
            dev5.innerHTML = `<span>发布时间：${alarm['w8'] || ''}</span>`;
            dev3.appendChild(dev5);

            let dev1 = document.createElement('div');
            dev1.className = 'half-bottom';
            dev1.innerHTML = alarm['w9'] || '';
            el.appendChild(dev1);
























            let dev0 = document.createElement('div');
            dev0.className = 'function-img';
            let warnType =parseInt(alarm['w4'] || '0');
            let warnLevel = parseInt(alarm['w6']);
            let warnTypeName = "";
            if (warnType == '0') {
                warnTypeName = "无历史数据";
            }else if (warnType == '01') {           //台风
                if (warnLevel == '01') {            //蓝
                    dev0.className = 'img01';
                }else if (warnLevel == '02') {     //黄

                }else if (warnLevel == '03') {     //橙

                }else if (warnLevel == '04') {     //红

                }
            }else if (warnType == '02') {
                if (warnLevel == '01') {

                }else if (warnLevel == '02') {

                }else if (warnLevel == '03') {

                }else if (warnLevel == '04') {

                }
            }else if (warnType == '03') {
                if (warnLevel == '01') {

                }else if (warnLevel == '02') {

                }else if (warnLevel == '03') {

                }else if (warnLevel == '04') {

                }
            }else if (warnType == '04') {
                if (warnLevel == '01') {

                }else if (warnLevel == '02') {

                }else if (warnLevel == '03') {

                }else if (warnLevel == '04') {

                }
            }else if (warnType == '05') {
                if (warnLevel == '01') {

                }else if (warnLevel == '02') {

                }else if (warnLevel == '03') {

                }else if (warnLevel == '04') {

                }
            }else if (warnType == '06') {
                if (warnLevel == '02') {

                }else if (warnLevel == '03') {

                }else if (warnLevel == '04') {

                }
            }else if (warnType == '07') {
                if (warnLevel == '02') {

                }else if (warnLevel == '03') {

                }else if (warnLevel == '04') {

                }
            }else if (warnType == '08') {
                if (warnLevel == '03') {

                }else if (warnLevel == '04') {

                }
            }else if (warnType == '09') {
                if (warnLevel == '02') {

                }else if (warnLevel == '03') {

                }else if (warnLevel == '04') {

                }
            }else if (warnType == '10') {
                if (warnLevel == '03') {

                }else if (warnLevel == '04') {

                }
            }else if (warnType == '11') {
                if (warnLevel == '01') {

                }else if (warnLevel == '02') {

                }else if (warnLevel == '03') {

                }
            }else if (warnType == '12') {
                if (warnLevel == '02') {

                }else if (warnLevel == '03') {

                }else if (warnLevel == '04') {

                }
            }else if (warnType == '13') {
                if (warnLevel == '02') {
                }else if (warnLevel == '03') {

                }
            }else if (warnType == '14') {
                if (warnLevel == '02') {

                }else if (warnLevel == '03') {

                }else if (warnLevel == '04') {

                }
            }
            el.appendChild(dev0);

            let dev1 = document.createElement('div');
            dev1.className = 'function-title';
            dev1.innerHTML = `<span>${alarm['w13'] || ''}</span>`;
            el.appendChild(dev1);

            let dev2 = document.createElement('div');
            dev2.className = 'function-time';
            dev2.innerHTML = `<span>${alarm['w8'] || ''}</span>`;
            el.appendChild(dev2);

            let dev3 = document.createElement('div');
            dev3.className = 'function-bottom';
            dev3.innerHTML = `<span>${alarm['w9'] || ''}</span>`;
            el.appendChild(dev3);

            this._marker = new minemap.Popup({
                closeOnClick: true,
                closeButton: false,
                offset: [0, 0]
            }).setLngLat(this._clickFeature.geometry.coordinates).setDOMContent(el).addTo(map);
        }
    }

    // setVisible(map) {
    //     map.setLayoutProperty('5a3ea454892d4824b622cdabb48950a2', 'visibility', 'visible');
    //     this._clear(map);
    // }
    //
    // setUnvisible(map) {
    //     map.setLayoutProperty('5a3ea454892d4824b622cdabb48950a2', 'visibility', 'none');
    //     this._clear(map);
    // }
    //
    // _clear(map) {
    //     if (map) {
    //         if (this._marker) {
    //             this._marker.remove();
    //         }
    //         if (this._popup) {
    //             this._popup.remove();
    //         }
    //     }
    //     this._marker = null;
    //     this._popup = null;
    //     this._moveFeature = null
    //     this._clickFeature = null
    // }
}